<template>
  <div>
    <div>
      <el-form label-position="left" :model="user" ref="form" :rules="rules" size="mini">

        <el-form-item label="用户名" prop="username">
          <el-input v-model="user.username" type="text"></el-input>
        </el-form-item>

        <el-form-item label="密码" prop="password">
          <el-input v-model="user.password" type="password"></el-input>
        </el-form-item>

        <el-form-item>
          <el-button @click="log" type="primary">登陆</el-button>
        </el-form-item>

      </el-form>
    </div>
    <div>
      <a :href="url"><img src="" alt="微博登录" @click="weibo"></a>
    </div>
  </div>
</template>

<script>
  export default {
    name: "Register",
    data: function () {
      return {
        user: {
          'username': '',
          'password': '',
          'password2': ''
        },
        url: 'https://api.weibo.com/oauth2/authorize?client_id=297351690&redirect_uri=http://127.0.0.1:8080/weibo_callback',
        rules: {
          username: [
            {required: true, message: '请输入用户名', trigger: 'blur'},
            {min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur'}
          ],
          password: [
            {required: true, message: '请输入密码', trigger: 'blur'},
            {min: 6, max: 12, message: '长度在 6 到 12 个字符', trigger: 'blur'}
          ],
        }
      }

    },
    methods: {
      log() {
        console.log(this.user);
        this.axios({
          url: "http://127.0.0.1:8000/myapp/log/",
          method: "post",
          data: {"username": this.user.username, "password": this.user.password}
        }).then(res => {
          if (res.data.code == 200) {
            alert(res.data.data);
          } else {
            alert(res.data.data);
          }
        })
      },
      weibo() {

      }
    }
  }
</script>

<style scoped>

</style>
